<template>
  <u-form :model="formData" ref="uForm">
    <template v-for="(item, index) in config">
      <yer-form-item v-if="item.type != 'custom'" :type="item.type" v-model="formData[item['key']]" :prop="item.key"
        :label-width="item.labelWidth ? item.labelWidth : labelWidth" :disabled="item.disabled"
        :default-value="defaultValue[item['key']]" :label="item.label" :list="item.list" :placeholder="item.placeholder"
        :required="item.required" :label-name="item.labelName ? item.labelName : labelName"
        :value-name="item.valueName ? item.valueName : valueName"
        :label-position="item.labelPosition ? item.labelPosition : labelPosition"
        :action="item.action ? item.action : action" :header="item.header ? item.header : header" :uploadFormData="item.uploadFormData ? item.uploadFormData : uploadFormData"
        :maxCount="item.maxCount ? item.maxCount : maxCount" :valueType="item.valueType ? item.valueType : valueType"
        :evalPath="item.evalPath ? item.evalPath : evalPath" :max-count="item.maxCount" :mode="item.mode?item.mode:mode" />
      <slot v-else :name="item.key"></slot>
    </template>
  </u-form>
</template>
<script>
import YerFormItem from '../yer-form-item/yer-form-item.vue'

export default {
  emits:['update:modelValue','input'],
  components: {
    YerFormItem
  },
  props: {
    config: {
      type: Array,
      default: () => []
    },
    defaultValue: {
      type: Object,
      default: () => {
        return {}
      }
    },
    inputAlign: {
      type: String,
      default: "left",
    }, //input内容对齐方式三种：left  center  right  默认left
    placeholder: {
      type: String,
      default: "请选择",
    },
    labelWidth: {
      type: [String, Number],
      default: 0,
    },
    labelPosition: {
      type: String,
      default: "left",
    }, //label显示的位置 默认left  可选top
    labelName: {
      type: String,
      default: "label",
    },
    valueName: {
      type: String,
      default: "value",
    },
    action: {
      type: String,
      default: "",
    },
    header: {
      type: Object,
      default: () => {
        return {}
      },
    },
    uploadFormData: {
      type: Object,
      default: () => {
        return {}
      }
    },
    valueType: {
      type: String,
      default: 'string' // 值类型  array  string
    },
    maxCount: Number,
    mode: {
			type: String,
			default: "base64", // filestream  base64
		}, //请求地址
    evalPath: {
      type: String,
      default: "data",
    },
  },
  data() {
    return {
      formData: {},

    }
  },
  mounted() {
    this.$nextTick(() => {
      // 整合表单验证规则
      let rule = {}
      this.config.forEach(item => {
        if (item.rules) {
          rule[item.key] = item.rules
        }
      });
      // console.log('rule', rule);
      this.$refs.uForm.setRules(rule);
    })

  },
  watch: {
    formData: {
      deep: true,
      handler(nVal){
        this.$emit('update:modelValue',nVal)
        this.$emit('input',nVal)
      }
    },
    defaultValue: {
      deep: true,
      immediate: true,
      handler(nVal){
        this.formData = nVal
      }
    }
  },
  methods: {
    // 获取formData
    getValidateFormData() {
      return new Promise((resolve, reject) => {
        this.$refs.uForm.validate(valid => {
          if (valid) {
            // console.log('验证通过');
            resolve(this.formData)
          } else {
            console.log('验证失败');
          }
        });
      })
    },
    // 获取表单数据
    getFormData() {
      return this.formData
    }
  }
}
</script>

<style></style>
